{{ $item := .item }}

{{ $link := $item.RelPermalink }}
{{ $target := "" }}
{{ if $item.Params.external_link }}
  {{ $link = $item.Params.external_link }}
  {{ $target = "target=\"_blank\" rel=\"noopener\"" }}
{{ end }}

{{ $resource := partial "functions/get_featured_image.html" $item }}
{{ $anchor := $item.Params.image.focal_point | default "Center" }}

<a href="{{ $link }}" {{ $target | safeHTMLAttr }} class="mb-5">
  <div class="md:flex">
    <div class="md:flex-shrink-0 overflow-hidden">
      {{ with $resource }}
        {{ $image := .Fill (printf "655x655 %s" $anchor) }}
        {{ if ne $image.MediaType.SubType "gif" }}{{ $image = $image.Process "webp" }}{{ end }}
      <img class="h-48 w-full object-cover md:w-48 hover:scale-125 transition duration-500 cursor-pointer object-cover" loading="lazy" src="{{ $image.RelPermalink }}" height="{{ $image.Height }}" width="{{ $image.Width }}" alt="{{ $item.Title | plainify }}">
      {{end}}
    </div>
    <div class="p-8">
      <div class="uppercase tracking-wide text-md text-primary-700 dark:text-primary-200 font-semibold">{{ $item.Title }}</div>
      <p class="block mt-1 text-sm leading-tight font-medium text-black dark:text-white">
        {{ ($item.Params.summary | default $item.Summary) | plainify | htmlUnescape | chomp -}}
      </p>
      <p class="mt-2 text-gray-500 dark:text-gray-400 text-sm">
        {{- $item.Date | time.Format (site.Params.locale.date_format | default ":date_long") -}}
      </p>
    </div>
  </div>
</a>
